import { Component, OnInit, ViewChild, ComponentFactoryResolver, Input } from '@angular/core';
import { ActivatedRoute, ParamMap } from '@angular/router';
import { Location } from '@angular/common';
import { MdlSnackbarService } from '@angular-mdl/core';
import { FbDynamicFormComponent } from '../../../../form/design/drawer/fb-dynamic-form.component';
import { TaskListMenuComponent } from '../../../../tasklist/tasklist/menus/tasklist-menu.component';
import { DynamicAnchorsDirective } from '../../../../common/directive/dynamic-anchors.directive';
import { TASK_LIST_DETAIL_TAB, TabComponent } from '../../../../tasklist/tasklist/tabs/tab-details';
import { TaskListService } from '../../../../tasklist/tasklist/tasklist.service';
import { CustomService } from '../../../custom.service';
@Component({
    templateUrl: './custom-edit.component.html',
    styleUrls: ['./custom-edit.component.scss'],
    providers: [CustomService, TaskListService]
})
export class CustomEditComponent implements OnInit {
    systemUrl: string = 'custom';
    bizId: number = 0;
    config: any = {};
    recId: number = 0;
    actId: number = 0;
    actDefId: number = 0;
    formDefId: number = 0;
    procDefId: number = 0;
    taskListGroupId: number = 0;
    taskListId: number = 0;
    mode: number = 0; //编辑模式
    selectedRecord: any[];
    self: any;
    callback: any;
    tabs: any[];//面板标签页

    @ViewChild(FbDynamicFormComponent, { static: true })
    private fbDynamicFormComponent: FbDynamicFormComponent;

    @ViewChild(TaskListMenuComponent, { static: true })
    private taskListMenuComponent: TaskListMenuComponent;

    @ViewChild(DynamicAnchorsDirective, { static: true }) archorHost: DynamicAnchorsDirective;
    details: any = TASK_LIST_DETAIL_TAB;

    constructor(
        private location: Location,
        private route: ActivatedRoute,
        private customService: CustomService,
        private taskListService: TaskListService,
        private componentFactoryResolver: ComponentFactoryResolver
    ) {
        this.bizId = +this.route.snapshot.paramMap.get('bizId');
        this.recId = +this.route.snapshot.paramMap.get('recId');
        this.actId = +this.route.snapshot.paramMap.get('actId');
        this.actDefId = +this.route.snapshot.paramMap.get('actDefId');
        this.taskListGroupId = +this.route.snapshot.paramMap.get('taskListGroupId');
        this.taskListId = +this.route.snapshot.paramMap.get('taskListId');
        this.mode = +this.route.snapshot.paramMap.get('mode') || 0;
        this.self = this;
        this.callback = this.goBack;
        this.selectedRecord = [{biz_id: this.bizId, rec_id: this.recId, act_id: this.actId, act_def_id: this.actDefId}]
    }

    ngOnInit() {
        this.customService.loadConfigDetail(this.bizId, this.taskListGroupId).subscribe(data => {
            this.config = data;
            this.formDefId = data.formDefId;
            this.procDefId = data.procDefId;
            this.fbDynamicFormComponent.onLoadValue(this.recId, 0, this.formDefId, 0, this.bizId);
        });
        this.taskListService.loadTaskListTab(this.taskListId, this.actDefId, 'custom').subscribe(tabs => this.tabs = tabs);
        this.taskListMenuComponent.loadTaskListMenu(this.taskListId, this.actDefId, 2, 0, 'custom');
    }

    /** 文书保存 */
    save() {
        let value = this.fbDynamicFormComponent.onSubmit(this.recId, 0, this.formDefId, this.bizId, false);
        if (value) {
            value['recId'] = this.recId;
            value['taskListGroupId'] = this.taskListGroupId;
            this.customService.saveUpdate(value).subscribe(data => {
                data.actDefId && (this.actDefId = data.actDefId);
                data.recId && (this.recId = data.recId);
                this.taskListService.loadTaskListTab(this.taskListId, this.actDefId, 'custom').subscribe(tabs => {
                    data.actId && (this.actId = data.actId);
                    this.tabs = tabs;
                });
                this.taskListMenuComponent.loadTaskListMenu(this.taskListId, this.actDefId, 2, this.actId, 'custom');
                this.fbDynamicFormComponent.onSubmit(this.recId, 0, this.formDefId, this.bizId);
            });
        }
    }

    /** 返回 */
    goBack() {
        this.location.back();
    }

    /** Tab切换 */
    onDetailTabChange(event) {
        $('.tab-container-header').height(event.index >= 1 ? '40px' : 'calc(100% - 40px)');
        if (event.index >= 1) {
            let componentName = this.tabs[event.index - 1].componentName;
            let componentFactory = this.componentFactoryResolver.resolveComponentFactory(TASK_LIST_DETAIL_TAB[componentName]);
            let viewContainerRef = this.archorHost.viewContainerRef;
            viewContainerRef.clear();
            let componentRef = viewContainerRef.createComponent(componentFactory);
            (<TabComponent>componentRef.instance).data = {
                'recId': this.recId,
                'actId': this.actId,
                'actDefId': this.actDefId,
                'bizId': this.bizId,
                'systemUrl': 'custom'
            };
        }else{
            $('.dynamic-tabs').hide();
        }
    }
}
